@color: #00bc9c;
@hover-color: #0dc7a7;
.talent{
    padding: 0 0 80px 0;
    background-color: #fff;
    .banner{
        width: 100%;  
        position: relative;  
        overflow: hidden;  
        height: 226px; 
        background: url(../../../static/images/banner2.jpg) no-repeat;
        background-size: cover;
        -webkit-background-size: cover;
        -o-background-size: cover;
        background-position: center 0;
        .search{
            width: 627px;
            border: 1px solid @color;
            margin: 0 auto;
            overflow: hidden;
            position: absolute;
            top: 50%;
            left: 50%;
            margin: -20px 0 0 -313.5px;
            input{
                width: 520px;
                height: 40px;
                background-color: #2a303c;
                border: none;
                float: left;
                padding: 0 0 0 20px;
                font-size: 14px;
                color: #ffffff;
            }
            button{
                background-color: @color;
                border: none;
                width: 105px;
                height: 40px;
                display: flex;
                justify-content: center;
                align-items: center;
                float: right;
                font-size: 14px;
                color: #1f2531;
                cursor: pointer;
                i{
                    display: block;
                    width: 15px;
                    height: 15px;
                    background: url(../../../static/images/common.png) no-repeat;
                    background-position: -630px -15px;
                    margin: 0 5px;
                }
                &:hover{
                    background-color: @hover-color;
                }
            }
        }
    }
    .center{
        max-width: 1200px;
        overflow: hidden;
        margin: 0 auto;
        img{
            width: 1200px;
            height: 365px;
        }
        h1{
            color: #000000;
            font-size: 20px;
            margin: 40px 0 0;
            font-weight: bold;
        }
        ul{
            li{
                width: 100%;
                overflow: hidden;
                border: 1px solid #dcdcdc;
                margin: 20px 0 0;
                .title{
                    height: 40px;
                    line-height: 40px;
                    background-color: #f3f7fa;
                    padding: 0 0 0 15px;
                    color: #979797;
                    font-size: 14px;
                }
                .context{
                    width: 100%;
                    padding: 18px 28px;
                    overflow: hidden;
                    position: relative;
                    .person{
                        width: 72px;
                        float: left;
                        img{
                            width: 72px;
                            height: 72px;
                            border-radius: 50%;
                        }
                        p{
                            color: #000000;
                            font-size: 14px;
                            text-align: center;
                            margin: 15px 0 0;
                        }
                        .star{
                            width: 100%;
                            margin: 10px 0 0;
                            overflow: hidden;
                            display: flex;
                            justify-content: center;
                            em{
                                display: block;
                                width: 12px;
                                height: 12px;
                                background: url(../../../static/images/common.png) no-repeat;
                                background-position: -777px -22px;
                                float: left;
                            }
                        }
                    }
                    .info{
                        position: relative;
                        margin: 0 100px;
                        p{
                            color: #000000;
                            font-size: 14px;
                            margin: 15px 0; 
                            em{
                                color: @color;
                            }
                        }
                    }
                    a{
                        position: absolute;
                        right: 54px;
                        top: 50%;
                        margin-top: -16.5px;
                        display: block;
                        width: 117px;
                        height: 33px;
                        line-height: 33px;
                        text-align: center;
                        color: #ffffff;
                        font-size: 14px;
                        background-color: @color;
                        &:hover{
                            background-color: @hover-color;
                        }
                    }
                }
            }
        }
    }
}
.talent-info{
    background-color: #ffffff;
    padding: 45px 0;
    .center{
        max-width: 1200px;
        overflow: hidden;
        margin: 0 auto;
        .overflow{
            overflow: hidden;
            position: relative;
        }
        .name{
            float: left;
            width: 212px;
            text-align: center;
            img{
                width: 210px;
                height: 210px;
                border-radius: 50%;
            }
            h1{
                color: #000000;
                font-size: 40px;
                margin: 33px 0 10px 0;
            }
            p{
                font-size: 22px;
                color: #000000
            }
        }
        .info{
            position: relative;
            margin: 0 200px 0 300px;
            h1{
                font-size: 20px;
                color: #000000;
            }
            p{
                font-size: 16px;
                margin: 20px 0;
                overflow: hidden;
                span{
                    float: left;
                    &:first-child{
                        display: block;
                        width: 120px;
                        float: left;
                    }
                }
            }
        }
        .skill{
            position: absolute;
            right: 0;
            top: 0;
        }
        .type,.context{
            width: 100%;
            overflow: hidden;
            margin: 100px 0 0 ;
            ul{
                border-bottom: 1px solid #f2f2f2;
                overflow: hidden;
                li{
                    float: left;
                    width: 173px;
                    height: 61px;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    color: #000101;
                    font-size: 16px;
                    cursor: pointer;
                    i{
                        display: block;
                        margin: 0 12px 0 0;
                        background: url(../../../static/images/common.png) no-repeat;
                        &.sjtb{
                            width: 26px;
                            height: 28px;
                            background-position: -400px -16px;
                        }
                        &.ldjb{
                        width: 24px;
                        height: 25px;
                        background-position: -462px -15px;
                    }
                    &.aqxw{
                        width: 28px;
                        height: 24px;
                        background-position: -522px -15px;
                    }
                }
                &.active{
                    color: @color;
                    background-color: #fff;
                    border-bottom: 3px solid @color;
                    i{
                            &.sjtb{
                                background-position: -432px -16px;
                            }
                            &.ldjb{
                                background-position: -491px -14px;
                            }
                            &.aqxw{
                                background-position: -562px -15px;
                            }
                        }
                }
                }
            }      
            &.context{
                margin: 30px 0;
                ul{
                    border: none;
                    li{
                        width: 100%;
                        height: auto;
                        overflow: hidden;
                        color: #000000;
                        overflow: hidden;
                        display: block;
                        h1{
                            font-size: 14px;
                            font-weight: bold;
                            margin: 0 0 20px 0;
                        }
                        p{
                            font-size: 12px;
                            color: #3e3a39;
                        }
                    }
                }
            }      
        }
        .work{
            width: 100%;
            overflow: hidden;
            ul{
                li{
                    width: 100%;
                    overflow: hidden;
                    border-bottom: 1px solid #f2f2f2;
                    line-height: 45px;
                    span{
                        display: block;
                        width: 60%;
                        float: left;
                        &:first-child,&:last-child{
                            width: 20%;
                        }
                    }
                    &.none{
                        span{
                            font-weight: bold;
                        }
                    }
                }
            }
        }
    }
}